<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript"
	src="${ pageContext.request.contextPath }/resources/script/jquery-3.1.1.js"></script>
<script type="text/javascript"
	src="${ pageContext.request.contextPath }/resources/script/layer-v3.0.1/layer/layer.js"></script>
<link type="text/css" rel="stylesheet"
	href="${ pageContext.request.contextPath }/resources/csses/not_leave_.css">
	<script type="text/javascript">
	$(document).ready(function() {
		/* $("#new").click(function(){
			layer.open({
				title : '添加新会议室',
				type : 2,
				area : ['460px','365px'],
				content: "${ pageContext.request.contextPath }/${ roler }/newroom",
				cancel: function(index){
					location.reload([true]);
					}
				})
			}); */
		$(".delete").click(function() {
			var id = $(this).parent().parent().attr('id');
			layer.confirm('是否确定要删除？', {
				btn : [ '确定', '取消' ]
			}, function() {
				var url = "${ pageContext.request.contextPath }/${ roler }/deletebooking?bId=" + id;
				window.location.href=url;
				layer.msg('您点了确定');
			}, function() {
				layer.msg('您点了取消');
			})
		});
	})
</script>
</head>
<body>
<div id="containertitle">
		会议室预约
		<div style="float: right;">
			<!-- <a id="new" style="text-align: right;" href="#">新增会议室</a> -->
		</div>
	</div>
	<table class="manager">
		<thead class="managerthead">
			<tr>
				<th width="20px" ></th>
				<th width="50px">房间</th>
				<th>名称</th>
				<th>开始时间</th>
				<th>结束时间</th>
				<th width="60px">预约人</th>
				<th width="110px">电话</th>
				<th width="30px"></th>
			</tr>
		</thead>
		<tbody>
			<c:forEach items="${ bookings }" var="booking" varStatus="statu">
				<tr id="${ booking.id }">
					<td class="cell">${ statu.index + 1 }</td>
					<td class="cell">${ booking.room.roomNumber }</td>
					<td class="cell">${ booking.name }</td>
					<td class="cell"><fmt:formatDate value="${ booking.bookingTime }" pattern="yyyy-M-d H:mm"/></td>
					<td class="cell"><fmt:formatDate value="${ booking.endTime }" pattern="yyyy-M-d H:mm"/></td>
					<td class="cell">${ booking.userName }</td>
					<td class="cell">${ booking.phone }</td>
					<%-- <td class="cell" align="center" style="width: 30px;"><img
						class="edit" alt="Edit"
						src="${ pageContext.request.contextPath }/resources/images/edit.png"
						width="20px;" height="20px;"></td> --%>
					<td class="cell" style="width: 30px;"><img class="delete"
						alt="Delete"
						src="${ pageContext.request.contextPath }/resources/images/Delete.png"
						width="20px;" height="20px;"></td>
				</tr>
			</c:forEach>
			<tr>
				<td style="text-align: center; font-size: 15px;" colspan="7"><a
					style="text-decoration: none; font-size: 12px;"
					href="${ pageContext.request.contextPath }/${ roler }/booking?current=${ currentPage > 1 ? currentPage - 1 : 1}"><<上一页&nbsp;&nbsp;</a>
					<c:choose>
						<c:when test="${ pagecount <= 5 }">
							<c:forEach begin="1" end="${ pagecount }" var="index" step="1">
								<c:choose>
									<c:when test="${ index == currentPage }">
										<a style="color: red;"><c:out value="${ index }" /> </a>
									</c:when>
									<c:otherwise>
										<a style="text-decoration: none;"
											href="${ pageContext.request.contextPath }/${ roler }/booking?current=${ index}"><c:out
												value="${ index }" /> </a>
									</c:otherwise>
								</c:choose>
							</c:forEach>
						</c:when>
						<c:when test="${ currentPage > pagecount - 2 }">
							<c:forEach begin="${ pagecount - 4 }" end="${ pagecount }"
								step="1" var="index">
								<c:choose>
									<c:when test="${ index == currentPage }">
										<a style="color: red;"><c:out value="${ index }" /> </a>
									</c:when>
									<c:otherwise>
										<a style="text-decoration: none;"
											href="${ pageContext.request.contextPath }/${ roler }/booking?current=${ index}"><c:out
												value="${ index }" /> </a>
									</c:otherwise>
								</c:choose>
							</c:forEach>
						</c:when>
						<c:otherwise>
							<c:choose>
								<c:when test="${ currentPage > 3 }">
									<c:forEach begin="${ currentPage - 2 }"
										end="${ currentPage + 2 > pagecount ? pagecount : currentPage + 2}"
										step="1" var="index">
										<c:choose>
											<c:when test="${ index == currentPage }">
												<a style="color: red;"><c:out value="${ index }" /> </a>
											</c:when>
											<c:otherwise>
												<a style="text-decoration: none;"
													href="${ pageContext.request.contextPath }/${ roler }/booking?current=${ index}"><c:out
														value="${ index }" /> </a>
											</c:otherwise>
										</c:choose>
									</c:forEach>
								</c:when>
								<c:otherwise>
									<c:forEach begin="1" end="${ pagecount < 5 ? pagecount : 5 }"
										var="index" step="1">
										<c:choose>
											<c:when test="${ index == currentPage }">
												<a style="color: red;"><c:out value="${ index }" /> </a>
											</c:when>
											<c:otherwise>
												<a style="text-decoration: none;"
													href="${ pageContext.request.contextPath }/${ roler }/booking?current=${ index}"><c:out
														value="${ index }" /> </a>
											</c:otherwise>
										</c:choose>
									</c:forEach>
								</c:otherwise>
							</c:choose>
						</c:otherwise>
					</c:choose> <a style="text-decoration: none; font-size: 12px;"
					href="${ pageContext.request.contextPath }/${ roler }/booking?current=${ currentPage < pagecount ? currentPage + 1 : pagecount}">&nbsp;&nbsp;下一页>></a>
				</td>
			</tr>
		</tbody>
	</table>
</body>
</html>